<template>
  <view class="comment-list-container">
    <view class="comment-list-group">
      <view class="comment-list-item">
          <view class="comment-head">
              <image class="head-image" :src="src"></image>
              <view>
                  <text>138******12</text>
                  <text>2021-09-22 14:47:47</text>
              </view>
          </view>
           <view class="comment-body">12323213</view>
           <u-line class="u-line"></u-line>
      </view>
    </view>
  </view>
</template>

<script>
export default {
    props:{
        list:{
            type: Array,
            default(){
                return []
            }
        }
    },
    data(){
        return {
            src:'./../../../static/logo.png'
        }
    }
};
</script>

<style lang="scss" scoped>
.comment-list-group{
    display: flex;
    flex-flow: column nowrap;
    justify-items: center;
    &> .comment-list-item{
        padding: 30rpx;
    }


    .comment-head{
        display: flex;
        flex-flow: row nowrap;

        .head-image{
            width: 100rpx;
            height: 100rpx;
            border-radius: 50%;
        }
    }

    .comment-head>view{
        display: flex;
        flex-flow: column nowrap;
        justify-content: center;
        margin-left: 20rpx;

        &>text:nth-last-child(1){
            font-size: 24rpx;
            color: #ccc;
        }
    }
}


.comment-list-item>.comment-body{
    padding: 20rpx 0;
}
</style>
